<template>
	<div class="addGoodBox">
		<u-popup v-model="visiable" mode="right">
			<view>
				<view class="top">
					<view class="">添加公告</view>
					<image @click="close" src="https://www.yongshantuan.cn/images/yongshan/platformSide/cha.png"
						mode=""></image>
				</view>
				<view class="content">
					<view class="list">
						<view class="title">公告</view>
						<view class="inputContent">
							<u-input type="textarea" v-model="notice" placeholder="请输入商品名称"></u-input>
						</view>
					</view>
				</view>
			</view>
		</u-popup>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				visiable: false,
				notice: '',
			}
		},
		watch: {
			show(newVal) {
				this.visiable = newVal;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.top {
		@include flex(space-between, center);
		font-size: 28rpx;
		font-weight: bold;
		line-height: 2;
		padding: 10rpx 32rpx;
		background-color: #FF9C40;

		image {
			width: 20rpx;
			height: 20rpx;
		}
	}

	.content {
		padding: 40rpx 32rpx;

		.list {
			margin-bottom: 48rpx;

			.title {
				font-size: 24rpx;
				line-height: 1;
				margin-bottom: 16rpx;
			}

			/deep/.u-input {
				background-color: #f5f5f5;
				border-radius: 12rpx;
				overflow: hidden;
				padding: 24rpx !important;
			}
		}

		.commenButton {
			background-color: #FA690A
		}
	}
</style>
<style lang="scss">
	.addGoodBox {
		/deep/.u-drawer-right {
			width: 85% !important;
		}
	}
</style>
